<template>
	<view class="reserve_container">
		<!-- 列表区域 -->
		<view class="list">
			<view class="list_detail" v-for="item in addData" :key="item.phy_id">
				<view><text>{{item.phy_projectName}}</text></view>
				<view class="count">
					<text>￥{{item.phy_salePrice}}</text>
					<text class="iconfont icon-gengduo"></text>
				</view>
			</view>
			<view class="list_detail">
				<view class="red"><text>合计</text></view>
				<view class="count red">
					<text>￥{{addPrice || 0}}</text>
					<text class="iconfont icon-gengduo"></text>
				</view>
			</view>

		</view>
		<!-- 选择部分区域 -->
		<view class="person_detail">
			<view class="list">
				<view class="list_detail" @click="ins.insShow=true">
					<view><text>体检机构</text></view>
					<u-select v-model="ins.insShow" :list="ins.insList" @confirm="insChange"></u-select>
					<view class="count address">
						<text>{{orderData.org_Name}}</text>
					</view>
				</view>
			</view>
			<view class="list">
				<view class="list_detail" @click="choicePerson">
					<view><text>体检人</text></view>
					<view class="count">
						<text>{{orderData.user_name}}</text>
					</view>
				</view>
			</view>
			<view class="list">
				<view class="list_detail" @click="calendar.calendarShow=true">
					<view><text>体检日期</text></view>
					<view class="count">
						<text>{{orderData.order_date}}</text>
					</view>
				</view>
			</view>
		</view>
		<!-- 按钮 -->
		<view class="sure_btn">
			<view @click="sure"><text>立即预定</text></view>
		</view>
	</view>
</template>

<script>
	export default {
		onLoad: function(option) {
			console.log(option)
			this.order_id = option.order_id;
			if (option.sel) {
				this.optionSel = option.sel;
				this.$http({ //获取体检加项的内容
					url: "/hasSelectAdd",
					data: {
						sel: option.sel
					}
				}).then((res) => {
					this.addData = res.data;
					this.add_projetName = res.data.map(item=>{
						return item.phy_projectName
					})
					this.add_projetName = this.add_projetName.join(',');
					console.log(123)
					console.log(this.add_projetName)
				})
			}
		},
		mounted() {
			//累加加项的金额
			this.addPrice = this.addData.reduce((pre_price, item) => {
				return pre_price + parseInt(item.phy_salePrice);
			}, 0)
			
			this.$http({
				url: "/hasSelectOrder",
					data: { 
						order_id:this.order_id
					}
				}).then((res) => {
					this.orderData = res.data[0];
			})

		},
		data() {
			return {
				//体检加项的数据
				addData: [],
				//总价格
				addPrice: 0,
				//体检日期
				dateSel: '',
				//选中的加项id
				optionSel: [],
				//订单id
				order_id:'',
				//订单内容,用户姓名那些
				orderData:[],
				//已体检加项的名称
				add_projetName:[],
			}
		},
		methods: {
			// 立即预定的回调
			sure() {
				let {order_id,addPrice,optionSel,add_projetName} = this;
				uni.navigateTo({
					url:`../HasFinishPay/HasFinishPay?order_id=${order_id}&&price=${addPrice}&&sel=${optionSel}&&add_projetName=${add_projetName}`
				})
			}
		}
	}
</script>

<style lang="scss">
	.reserve_container {
		.list {
			background-color: rgba(221, 221, 221, 0.1);
			margin-top: 40rpx;

			.list_detail {
				.title {
					text-align: center;
					padding: 20rpx 0 0 0;
				}

				.red {
					color: red;
				}

				display: flex;
				justify-content: space-between;
				padding:30rpx 20rpx;
				border-bottom: 1px solid #ccc;
				color: #464646;

				.count {
					text {
						margin: 0 8rpx;
					}
				}
			}
		}

		.person_detail {
			margin-top: 50rpx;
			background-color: rgba(221, 221, 221, 0.1);

			.list {
				margin-top: 10rpx;
			}

			.address {
				font-size: 26rpx;
			}
		}

		.sure_btn {
			width: 750rpx;
			height: 96rpx;
			background-color: #59b58d;
			color: white;
			font-size: 18px;
			text-align: center;
			position: fixed;
			bottom: 0;
			line-height: 96rpx;
		}

	}
</style>
